<!DOCTYPE html>
<html>
	<head>
		<meta http-equiv="content-type" content="text/html;charset=UTF-8" />
		<title>Code Examples for Designing with Progressive Enhancement</title>
		<style type="text/css">
			/*styles for demos index page*/
			body { margin: 50px 300px 30px 100px;  font-family: "Segoe UI", Arial, sans-serif; color: #333; background: #fff; }
			a:link { color: #307A3D; }
			a:visited, a:active { color: #5ea84a;  }
			a:hover { color: #076517; }
			#code-examples li { font-weight: bold; }
			#code-examples li span.variations { font-weight: normal; }
			.enhanced h1 {  font-weight:normal; line-height:1; text-transform:lowercase; font-size:.6em; font-weight:normal; padding-bottom: 2em; margin-bottom: 3em; border-bottom: 1px solid #aaa;  }
			.enhanced .title-dw { color:#191919; font-size:3.5em; display:block; }
			.enhanced .title-pe {  font-weight:bold; color:#488D42; font-size:4.7em; display:block;  }
			.enhanced .title-sub { color:#474747; margin-top: .7em;display:block;font-size:2.5em; margin-top:.7em; }
			.enhanced h2 { font-size: 1em; font-weight: normal; }
			p.rights { font-size: .9em; margin: 1.5em 0 2em;  }
			#related-links { font-size: .8em; }
		</style>
		<script type="text/javascript" src="_shared/EnhanceJS/enhance.js"></script>		
		<script type="text/javascript">enhance({appendToggleLink: false});</script>
	</head>
	<body>
		<h1><span class="title-dw">Designing with</span> <span class="title-pe">Progressive Enhancement</span> <span class="title-sub">Building the Web that Works for Everyone</span></h1>
		<h2>Public code examples:</h2>
		<ul id="code-examples">
			<li><a href="collapsible/index.html">Collapsible content</a></li>	
			<li><a href="tree/index.html">Tree</a></li>
			<li><a href="charting/index.html">Charting with HTML 5 Canvas</a> <span class="variations">(<a href="charting/vanilla.html">vanilla version</a>)</span></li>
			<li>More coming soon...</li>
		</ul>
		<p><strong>Bought the book?</strong> Access all of the code examples at <a href="http://filamentgroup.com/dwpe">filamentgroup.com/dwpe/</a></p>
		<p class="rights">All code is &copy;2010 <a href="http://filamentgroup.com">Filament Group, Inc.</a> and is released under the <a href="license.txt">MIT License</a> (free for use on commercial sites).</p>	
		<h2>Related links:</h2>		
		<ul id="related-links">
			<li><a href="http://filamentgroup.com/dwpe">Book website for Designing with Progressive Enhancement</a></li>
			<li><a href="http://enhancejs.googlecode.com/">EnhanceJS code respository</a></li>
			<li><a href="http://filamentgroup.com/">Filament Group Website</a></li>
		</ul>
	
	</body>
</html>